<template>
	<div class="serviceSelection">
		<div style="margin-top: 15px;"></div>
		<FilterTable
      ref="table"
      :onRowSelectChange="selectChange"
      :fetchapi="fetchApi"
      :params="fetchParams"
      :datakey="'records'"
      :columns="columns"
      :onColumnsChange="columns => this.columns = columns"
    />
		<div
      :style="{
        position: 'absolute',
        left: 0,
        bottom: 0,
        right: 0,
        zIndex: 9,
        borderTop: '1px solid #e9e9e9',
        padding: '10px 20px',
        background: '#fff',
        textAlign: 'right'
      }"
    >
      <el-button @click="closeDialog">取 消</el-button>
      <el-button :disabled="this.isChoice" @click="saveDialog" type="primary">保 存</el-button>
    </div>
	</div>
</template>

<script>
import { queryValidList } from '@/api/retail/basedata/maintenance'
import { dictionary } from '@/utils/dictMixin';
export default {
  name: 'productSelection',
  mixins: [dictionary],
	data (){
		return {
			columns: this.createTableColumns(), //table数据
      fetchApi: queryValidList,
      fetchParams: {},
      selectedRows: [], //选中列表中的行
      isChoice: true, //按钮是否可以选择
      saveSelections: [] // 被选择的数据
		}
	},
  created (){
    // this.init();
  },
	methods: {
    init (){
      // 初始化加载数据
      this.fetchParams = Object.assign({},this.fetchParams)
    },
    selectChange (rows){ //选中时触发的函数
      this.selectedRows = rows;
      this.isChoice = this.selectedRows.length > 0? false: true;
    },
		changeHandle(val) { //搜索事件
      this.fetchParams = Object.assign({}, val);
    },
    createTableColumns (){
      return [
        {
          title: '序号',
          dataIndex: 'index',
          width: 80,
          render: props => {
            return <span>{props.row.index + 1}</span>;
          }
        },
        {
          title: '项目代码',
          dataIndex: 'serviceCode',
        },
        {
          title: '项目名称',
          dataIndex: 'serviceName',
        },
        {
          title: '费用类型',
          dataIndex: 'serviceType',
          filterItems: this.createDictList('1421'),
          render: props => {
            return <span> { this.preDictHandler(props.row.serviceType,'1421')} </span>
          }
        },
        {
          title: '费用金额',
          dataIndex: 'actualSellPrice',
          render: props => {
            // 首次渲染 添加 参考值
            if (props.row['isFirst'] == null || props.row['isFirst'] == undefined) {
              props.row['isFirst'] = true
            }
            if (props.row['isFirst']) {
              // 首次渲染
              props.row.actualSellPrice = props.row.actualSellPrice || props.row.directivePrice
              props.row['isFirst'] = false
            } else {
              // 修改渲染
              props.row.actualSellPrice = props.row.actualSellPrice || 0
            }
            return <el-input value={props.row.actualSellPrice} type='number' placeholder='' onInput={(e)=>{
              props.row.actualSellPrice = Number(e)
            }}></el-input>
          }
        }
      ]
    },
		closeDialog(param) { //取消
      this.$emit('close', false);
    },
    saveDialog () { //保存
      console.log(this.selectedRows)
      if(this.selectedRows.length > 0){
        let sendOutSelectData = this.selectedRows.map(item => {
          return {
            serviceId: item.serviceId,
            serviceCode: item.serviceCode,
            serviceName: item.serviceName,
            serviceType: item.serviceType,
            actualSellPrice: item.actualSellPrice,
          }
        })
        this.$emit('close', false, sendOutSelectData)
      }
    },
    // 字典数据使用前预处理
    preDictHandler(val, code){
      let resultText = val && String.prototype.includes.call(val, code) ? this.createDictText(val, code) : val;
      return resultText;
    },
	},
}
</script>

<style scoped="scoped" lang="less">
</style>
